<template>
    <div class="dialogue">
        <main class="dialogue-main">

            <div class="unlogin-tip" v-show="userToken == null?true:false">
                <p class="tip">请登录后查看消息</p>
                <div>
                    <button @click="toLogin">登录</button>
                </div>
            </div>
            <p class="tip" v-show="userToken == null?false:true">- 暂无消息 -</p>

        </main>

    </div>
</template>
<script>
import {mapState } from "vuex";
export default {
    name:"Dialogue",
    computed:{
        ...mapState(["userToken"])
    },
    methods:{
        toLogin(){
            this.$router.push({path:"/login"})
        }
    },
    beforeRouteLeave(to,from,next){
        this.$store.state.fromPagePath =from.path;
        next();
    }
}
</script>
<style lang="scss" scoped>
@import "../assets/common/base.scss";
.dialogue-main{
    p{
        text-align: center;
    }
    .tip{
        margin-top: 10px;
        font-size: 16px;
        color: #888;
    }
    .unlogin-tip{
        text-align: center;
        margin-top: 50px;
        p{
            font-size: 14px;
        }
        button{
            margin-top: 20px;
            background-color: $mainCol;
            color: #fff;
            padding: 10px 30px;
            border-radius: 13px;
        }
    }
}
</style>